var countCom = Vue.extend({
    template: `
    <div id="count-com">
        <p>{{ numbers }}</p>
        <div v-if="prop" id="props-com">
            <div id="count-content">
                <div id="count-header">
                    <p>提示消息</p>
                </div>
                <div id="count-message">
                    <p>{{ prop }}</p>
                </div>
            <a href="/" id="count-close">确定</a>
            </div>
        </div>
    </div>
    `,
    data() {
        return {
            numbers: 60,
            prop: ""
        }
    },
    watch: {
        numbers:function(val) {
          if(val <= 0){
              this.prop = "操作超时";
              clearInterval(this.interval);
          }        
        }
    },
    mounted() {
        this.interval = setInterval(() => {
            this.numbers--;
        },1000)
    },
    beforeDestroy() {
        if(this.interval) {
            clearInterval(this.interval);
        }
    }
});